<template>
	<view class="page">
		<image :src="company.logo"></image>
		<view style="font-size: 30rpx;">{{company.name}}</view>
		<u--form labelPosition="left" :model="form" ref="form1" labelWidth="110rpx"
			:labelStyle="{ fontSize: '24rpx', borderRight: 'solid 2rpx #bbb' }">
			<u-form-item label="公司名称" prop="name" borderBottom>
				<u--input placeholder="请输入公司名称" border="none" v-model="form.name" ></u--input>
			</u-form-item>
		</u--form>
		<view class="radio">
			
		
		</view>
		<view style="position: relative;width: 100%;">
			<u-button :disabled='disabled' @click='register' iconColor="#fff" text="注册公司" color=" #3975c6"></u-button>
		</view>
		<view style="position: relative;width: 100%;">
			<u-button  :disabled='disabled' @click='loginOut' text="切换账号" ></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				disabled: false,
				form: {
					name: ""
				},
				rules: {
					'name': [{
						type: 'string',
						required: true,
						message: '请填写公司名称',
						trigger: ['blur', 'change']
					}],

				},
			};
		},
		onReady() {
			this.$refs.form1.setRules(this.rules)
		},
		computed: {
			company() {
				return {
					name: uni.getStorageSync('companyName'),
					logo: uni.getStorageSync('companyLogo'),
				}
			}
		},
		methods: {
			register() {
				this.$refs.form1.validate().then(res => {
					this.disabled = true
					const obj = {
						name:this.form.name
					}
					this.$api_company.Shop.Add(obj).then(res => {
						uni.$u.toast('创建成功')
						uni.reLaunch({
							url:'/shop/index'
						})
					}).catch(err => {
						uni.$u.toast(err.message)
						this.disabled = false
					})
				})
			},
			loginOut() {
				uni.setStorageSync('token', null);
				uni.setStorageSync('user', null);
				uni.reLaunch({
					url:'/login/index'
				})
			}
		}
	}
</script>

<style lang="scss">
	.page {
		height: 60vh;
		color: #010101;
		font-size: 26rpx;
		width: calc(100% - 160rpx);
		margin: auto;
		display: flex;
		flex-direction: column;
		align-items: center;
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		justify-content: space-between;
	}

	image {
		width: 150rpx;
		height: 150rpx;
	}



	.radio {
		text {
			color: #0000ED;
		}

		flex: 0.8;
		display: flex;
		justify-content: flex-start;
		align-items: flex-end;
	}


	::v-deep .u-form {
		width: 100%;
	}
</style>